Images can be more than half of the data that makes up a typical website. Although there are tools that may automatically reduce the size of the images on behalf of the website owner, many of the images may not be needed for the page as they may never be seen by the user. For example, some pages are longer than the viewport of the device (a window or other viewable area on the screen) and require the user to scroll to view the entire page. An example of such a page is a blog, which typically is a relatively long page with a series of stories, the most recent of which are on top. When the page is loaded, only the images within the viewport (the visible portion of the client window) can be viewed. However, most client network application such as browsers download all of the images on the page before the page is ready. This may slow down page performance waste bandwidth for images that may never be seen (e.g., if the user does not scroll down to actually view the images that are not on the viewport).
Most client network applications create an image placeholder for each single image that is referenced in a web page. Most images are externally sourced and downloaded by the client network application and are displayed in the location of the corresponding image placeholders. If an image cannot be displayed (e.g., an error occurred when the image was attempted to be downloaded), most client network applications display a broken image or other error display in the location of the corresponding image placeholder.